<template>

  <el-row :gutter="10" style="height:100%">
    <el-col :span="24" style="height:100%">
      <div style="overflow-y: auto;height:100%;padding: 10px;">
        <el-table :data="tableData" style="width: 100%;;margin:0 auto;"
          :header-row-style="{fontSize:'17px',color:'white'}"
          :row-style="{fontSize:'15px',color:'white'}" border>
          <el-table-column prop="index" label="序号" align="center" width="70px">
            <template slot-scope="scope">
              <span>{{scope.$index+1}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="reportName" label="报告名称" align="center" min-width="180px">
          </el-table-column>

          <el-table-column prop="dateTime" label="下载" align="center" min-width="90px">
            <template slot-scope="scope">
              <i @click="clickDownloadItem(scope.row)" class="el-icon-download btn_download"></i>
            </template>
          </el-table-column>

        </el-table>

      </div>
    </el-col>

  </el-row>
</template>
<script>
// import Charts from '@jiaminghi/charts';
import pieOption1 from './charts/pieOption1';
import { tableData } from './data';
import barOption1 from './charts/bar1';
import { downloadFile } from '@/common/download';
import { queryEmergPlanList } from '@/service/emergPlan';

export default {
  components: {},
  data() {
    return {
      loading: true,
      tableData: [],
      option1: {},
    };
  },
  methods: {
    clickDownloadItem(row) {
      downloadFile(row.fileUrl);
    },
    async loadTable() {
      const res = await queryEmergPlanList({});
      console.log('loadTable', res);
      if (res.dataList) {
        this.tableData = res.dataList;
      }
    },
  },

  mounted() {
    this.loadTable();
  },
};
</script>
<style scoped>
::v-deep .el-table th,
::v-deep .el-table tr,
::v-deep .el-table td,
::v-deep .el-table th.el-table__cell {
  background-color: transparent;
}

::v-deep .el-table td.el-table__cell,
::v-deep .el-table th.el-table__cell.is-leaf {
  /* border-bottom: 0; */
}

::v-deep.el-table--enable-row-transition .el-table__body td.el-table__cell {
  background-color: transparent !important;
}
::v-deep.el-table td.el-table__cell div.cell {
  background-color: transparent !important;
}
::v-deep .el-table {
  background-color: transparent !important;
}

::v-deep .el-table__row {
  background-color: transparent !important;
}

::v-deep .el-table__row {
  background-color: transparent !important;
}

.el-table .cell {
  padding-left: 1px;
  padding-right: 1px;
}

/* 去除底部白线 */
.el-table::before {
  background-color: transparent;
}

.el-table::before {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0px;
}

.home_event_item {
  /* color: #06ddff;
  cursor: pointer;
  font-size: 14px;
  text-align: start;
  padding-left: 25px;
  margin-top: 3px;
  text-decoration: underline;
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; */
}
.btn_download {
  cursor: pointer;
  font-size: 20px;
}
</style>